<template>
  <div class="page-container">
    <SearchBox class="search-box" />
    <ChartBox class="chart-box" />
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import SearchBox from './components/SearchBox.vue'
import ChartBox from './components/ChartBox.vue'

export default defineComponent({
  name: 'Index',
  components: {
    SearchBox,
    ChartBox,
  },
  props: {},
  setup() {
    
    return {}
  },
})
</script>

<style lang="scss" scoped>
  .page-container {
    background-color: #0b2838;
    height: 100%;

    .search-box {
      position: absolute;
      top: 20px;
      left: 25%;
      width: 50vw;
    }
    
    .chart-box {
      width: 100%;
      height: 100%;
      overflow: hidden;
      // background-color: #fff;
    }
  }

</style>
